hidden{
    width: 100%;
    position: relative;
    background: #EF2966;
    overflow: hidden;
}
.lucky-top {
    width: 100%;
    position: relative;
}
.lucky-top img {
    width: 100%;
}
.box{
    width: 100%;
    position: relative;
    overflow: hidden;
    background: #EF2966;
    padding: 0 .1rem;
}

.title-bg{
    width: 1.95rem;
    height: .45rem;
    font-size:.18rem;
    text-align: center;
    line-height: .42rem;
    font-weight:bold;
    color:rgba(239, 41, 102, 1);
    background: url('../images/title-bg.png') no-repeat;
    background-size: 100%;
    margin: 0 auto .12rem;
}
.lucky-rules-title{
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -.97rem;
}
.lucky-box{
    width: 100%;
    padding: .4rem .1rem .1rem;
    background: rgba(255, 254, 227, 1);
    border-radius: .05rem;
    margin-bottom: .4rem;
}
.lucky-box-text{
    padding-bottom: .3rem;
}
.lucky-box-text p{
    text-align: center;
    color:#EC1C67;
    line-height: .25rem;
}
.lucky-text-title{
    font-size: .15rem;
    font-weight:bold;
}
.lucky-text-content{
    font-size: .13rem;
    color:rgba(236, 28, 103, 1);
}
.rules-box{
    width: 100%;
    padding: .3rem .27rem .1rem;
    background: rgba(255, 254, 227, 1);
    border-radius: .05rem;
}
.rules-box-text{
    padding-bottom: .2rem;
}
.rules-box-text p {
    text-align: center;
    color: #EC1C67;
    line-height: .25rem;
}
.rules-text-title {
    font-size: .15rem;
    font-weight: bold;
}

.rules-text-content {
    font-size: .13rem;
    color: rgba(236, 28, 103, 1);
}
.prompt{
    width: 100%;
    padding: .17rem .17rem .4rem;
}

.prompt p{
    font-size:.11rem;
    font-weight:400;
    color:rgba(255, 250, 222, 1);
    line-height:.26rem;
}
.lucky-star{
    width: 100%;
    padding-bottom: .3rem;
    display: flex;
    justify-content: center;
}
.lucky-star-head{
    width: 50%;
    padding-top: .4rem;
    text-align: center;
    position: relative;
}
.star-head{
    width: .4rem;
    height: .4rem;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: 0 auto;
    overflow: hidden;
    border: .02rem solid #AB4701;
    border-radius: 50%;
    z-index: 99;
    background: #fff;
}
.star-head img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
.decoration {
    position: absolute;
    left: .4rem;
    top: -.2rem;
}
.decoration img {
    width: .42rem;
    height: .4rem;
}
.lucky-name{
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow:ellipsis;
    padding-top: .05rem;
    font-size:.13rem;
    font-weight:bold;
    color:rgba(236, 28, 103, 1);
}
.lucky-id{
    width: 100%;
    // text-align: center;
    overflow: hidden;
    white-space: nowrap;
    text-overflow:ellipsis;
    font-size:.12rem;
    font-weight:bold;
    color:rgba(236, 28, 103, 1);
    opacity:0.7;
}
.every-day{
    width: 100%;
    display: flex;
    flex-flow: wrap;
    // justify-content: center;
}
.every-day-item{
    width: 25%;
    text-align: center;
    position: relative;
    padding-bottom: .27rem;
}
.every-day-head{
    width: .4rem;
    height: .4rem;
    border-radius: 50%;
    overflow: hidden;
    border: .02rem solid #F79018;
    margin: 0 auto;
}
.every-day-head img{
    width: 100%;
    height: 100%;
}
.every-day-decoration{
    position: absolute;
    top: -0.08rem;
    left: .14rem;
}
.every-day-decoration img{
    width: .24rem;
    height: .21rem;
}
.switch{
    width: 100%;
    display: flex;
    justify-content: center;
    padding-bottom: .1rem;
}
.switch p{
    width: 1.24rem;
    height: .49rem;
    background: url('../images/switch.png') no-repeat;
    background-size: 100% 100%;
    text-align: center;
    line-height: .45rem;
    font-size:.18rem;
    font-weight:bold;
    color:rgba(239, 41, 102, 1);
    margin: 0 .05rem;
}
.switch .active{
    color:rgba(236, 28, 103, .52);
}
.lucky-list{
    width: 100%;
    padding-bottom: .2rem;
    background: #fff;
    border-radius: .05rem;
}
.list-title{
    width: 100%;
    display: flex;
    padding-top: .3rem;
}
.ranking-title{
    width: 20%;
}
.ranking-head {
    width: 20%;
}
.ranking-name {
    width: 30%;
}
.ranking-value {
    width: 30%;
    padding-right: .12rem;
    display: flex;
    align-items: center;
    text-align: right;
    justify-content: flex-end;
}
.list-title p{
    font-size:.13rem;
    font-weight:bold;
    color:rgba(236, 28, 103, 1);
    line-height:.18rem;
    text-align: center;
}

.ranking-value img{
    width: .2rem;
    height: .2rem;
}
.ranking-list-item{
    width: 100%;
    height: .85rem;
    display: flex;
    align-items: center;
}
.ranking-list-item-active{
    background:rgba(255, 249, 220, 1);
}
.ranking-list-box-1{
    display: none;
}

.item-num {
    width: 20%;
}

.item-num p{
    text-align: center;
    font-size:.18rem;
    font-weight:bold;
    color:rgba(236, 28, 103, 1);
}
.item-num .num-1 {
    width: .34rem;
    height: .34rem;
    background: url('../images/num-1.png') no-repeat;
    background-size: 100% 100%;
    margin: 0 auto;
    text-align: center;
    line-height: .34rem;
    font-size: .13rem;
    font-weight: bold;
    color: rgba(255, 255, 255, 1);
}
.item-num .num-2 {
    width: .34rem;
    height: .34rem;
    background: url('../images/num-2.png') no-repeat;
    background-size: 100% 100%;
    margin: 0 auto;
    text-align: center;
    line-height: .34rem;
    font-size: .13rem;
    font-weight: bold;
    color: rgba(255, 255, 255, 1);
}
.item-num .num-3 {
    width: .34rem;
    height: .34rem;
    background: url('../images/num-3.png') no-repeat;
    background-size: 100% 100%;
    margin: 0 auto;
    text-align: center;
    line-height: .34rem;
    font-size: .13rem;
    font-weight: bold;
    color: rgba(255, 255, 255, 1);
}
.item-num .not{
    width: .13rem;
    margin: 0 auto;
}
.item-head{
    width: 20%;
    position: relative;
}
.item-head-img{
    width: .4rem;
    height: .4rem;
    border-radius: 50%;
    border: .02rem solid #EC1C67;
    overflow: hidden;
}
.item-head-img img{
    width: 100%;
    height: 100%;
}
.item-head-decoration {
    position: absolute;
    left: -0.12rem;
    top: -0.16rem;
}

.item-head-decoration img {
    width: .29rem;
    height: .27rem;
}
.item-information {
    width: 30%;
}
.item-name{
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow:ellipsis;
    font-size:.13rem;
    font-weight:bold;
    color:rgba(236, 28, 103, 1);
}
.item-id{
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow:ellipsis;
    font-size:.13rem;
    font-weight:bold;
    color:rgba(236, 28, 103, 0.7);
}
.item-value{
    width: 30%;
}
.item-number{
    position: relative;
}
.item-number p{
    font-size: .14rem;
    padding-right: .32rem;
    color: #EC1C67;
    font-weight:bold;
    text-align: right;
}
.item-number img{
    width: .22rem;
    height: .22rem;
    position: absolute;
    top: -0.12rem;
    right: .2rem;
}
.distance{
    font-size: .12rem;
    color: #EC1C67;
    padding-right: .32rem;
    text-align: right;
}
.back-top{
    width: 100%;
    padding: .25rem 0;
    text-align: center;
}
.back-top img{
    width: .42rem;
    height: .3rem;
}